<!--
 * @Description: ...
 * @Author: yangli 121029539@qq.com
 * @Date: 2025-02-06 11:23:56
 * @LastEditTime: 2025-02-12 09:37:37
 * @LastEditors: yangli 121029539@qq.com
 * @FilePath: \uniapp\src\pages\index\mine.vue
-->
<template>
    <view class="bg-page min-h-screen">
        <view class="mb-[10px] page-top py-[46rpx] px-[56rpx] flex flex-row justify-between items-center">
            <view class="flex items-center flex-row">
                <image v-if="userInfo && userInfo.avatar" :src="userInfo.avatar"
                    class="w-[120rpx] h-[120rpx] rounded-full" />
                <image v-else src="/static/images/user/default_avatar.png" class="w-[120rpx] h-[120rpx] rounded-full" />

                <view class="ml-[32rpx]">
                    <view v-if="token" class="text-white text-[36rpx]">
                        {{ userInfo?.nickname || '未登录' }}
                    </view>
                    <navigator v-else class="flex items-center" hover-class="none" url="/pages/login/login">
                        <view class="text-white text-3xl ml-[20rpx]">去登录</view>
                    </navigator>
                </view>
            </view>
            <image @click="toPage('/pages/user_data/user_data')" v-if="token" src="/static/images/user/setting.png"
                class="w-[48rpx] h-[48rpx]" />
        </view>
        <view class="p-[32rpx] bg-white">
            <view class="text-[36rpx] text-main font-extrabold pb-[32rpx]">我的服务</view>
            <view class="">
                <u-grid :col="4" :border="false">
                    <u-grid-item @click="toPage(item.path, item.type)" :custom-style="{ padding: '0 0 32rpx 0' }"
                        v-for="(item, index) in dataList" :key="index">
                        <image :src="`/static/images/user/user${index + 1}.png`" class="w-[52rpx] h-[52rpx]" />
                        <view class="text-c5 text-base mt-[14rpx]">
                            {{ item.title }}
                        </view>
                    </u-grid-item>
                </u-grid>
            </view>
        </view>
    </view>
</template>

<script setup lang="ts">
import { getIndex } from '@/api/shop'
import { onLoad, onShow, onPageScroll } from '@dcloudio/uni-app'
import { computed, reactive, ref } from 'vue'
import { useAppStore } from '@/stores/app'
import { useUserStore } from '@/stores/user'
const appStore = useAppStore()
const userStore = useUserStore()
const token = computed(() => userStore.token)
const userInfo = computed(() => userStore.userInfo)
console.log(userInfo.value)

const dataList = [
    {
        title: '我的权益',
        path: '/pages/index/insurance',
        // type:2是tabbar
        type: 2
    },
    {
        title: '我的报修',
        path: '/pages/index/repair',
        type: 2
    },
    {
        title: '个人设置',
        path: '/pages/user_set/user_set'
    },
    {
        title: '我的钱包',
        path: '/packages/pages/user_wallet/user_wallet'
    },
    {
        title: '联系客服',
        path: '/pages/customer_service/customer_service'
    }
]
const toPage = (path: any, type = 1) => {
    // if(!token.value) return uni.navigateTo({url:'/pages/login/login'})
    if (type == 2) {
        uni.switchTab({ url: path })
    } else {
        uni.navigateTo({ url: path })
    }
}

onLoad(async () => {
    // await userStore.getUser()
})
</script>

<style lang="scss" scoped>
.page-top {
    background: url('../../static/images/user/userbg.png') no-repeat 0 0;
    background-size: cover;
}
</style>
